<template>
  <div class="common-page">
    <div class="common-page-top">
      <van-sticky>
        <CommonHeader :title="title" :path="path" />
      </van-sticky>
    </div>
    <div class="common-page-main">
      <slot name="content"></slot>
    </div>
  </div>
</template>

<script>
// @ is an alias to /src
import CommonHeader from "@/components/common-header";
export default {
  props: {
    title: String,
    path: String,
  },
  name: "common-page",
  components: { CommonHeader },
};
</script>
<style lang="less" scoped>
.common-page {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.common-page-top {
  background: url("~@/assets/img/banner-bg.png") center no-repeat;
  background-size: cover;
  width: 100%;
  height: 14rem;
}
.common-page-main {
  margin: 0.4rem 0.8rem;
  position: absolute;
  top: 3rem;
  height: auto;
  overflow: hidden;
}
</style>
